<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>投资详情</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link href="css/public.css" rel="stylesheet" />
		<link href="css/iconfont.css" rel="stylesheet" />
		<style type="text/css">
			.account{
				background: url(images/bg.png) no-repeat center;
				background-size: cover;
				padding-top: 56px;
				color: #FFFFFF;
				text-align: center;
			}
			.account h4{
				padding-bottom: 65px;
			}
			.account .extras{
				display: flex;
				display: -webkit-flex;
				padding-bottom: 15px;
			}
			.account .extras>div{
				flex: 1;
				-webkit-flex: 1;
				font-size: 14px;
			}
			.account .extras>div>span{
				display: block;
			}
			.status{
				padding: 16px 10px 14px;
				background: #FFFFFF;
				margin-bottom: 12px;
			}
			.mui-table-view{
				margin-bottom: 10px;
			}
			.mui-table-view-cell{
				padding:12px 10px;
			}
			.mui-table-view-cell>a:not(.mui-btn){
				margin:-12px -10px;
			}
			.mui-table-view-cell.mui-collapse .mui-collapse-content{
				margin:12px -10px -12px
			}
			.mui-table-view-cell.mui-active{
				background: #FFFFFF;
			}
			.mui-table-view:before,.mui-table-view:after{
				height: 0;
			}
			.border-bottom{
				border-bottom: 1px solid #DDDDDD;
			}
			.card{
				background: #FFFFFF;
				margin-bottom: 10px;
			}
			.card .title{
				height: 46px;
				line-height: 46px;
				padding: 0 10px;
			}
			.card .content{
				padding: 15px 10px;
			}
			.mui-bar-footer{
				height: 50px;
				padding: 0;
				box-shadow: 0 0 0 rgba(0,0,0,0);
			}
			.head.mui-bar{
				background: transparent;
				box-shadow: 0 0 0 rgba(0,0,0,0);
			}
			.head.mui-bar a{
				color: #FFFFFF;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar  head">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title"></h1>
		</header>
		<nav class="mui-bar mui-bar-footer">
			<span class="fix-footer-btn btn-red" id="investment">立即投资</span>
		</nav>
		<div class="mui-content">
			<div class="account">
				<h3 class="f_34 mb_10">12.0%</h3>
				<h4 class="f_14">预算年化收益率</h4>
				<div class="extras">
					<div>
						<span><span class="f_18">1</span>个月</span>
						<span>借款期限</span>
					</div>
					<div>
						<span class="f_18">5.53%</span>
						<span>投标进度</span>
					</div>
					<div>
						<span  class="f_18">188900.0 元</span>
						<span>剩余金额</span>
					</div>
				</div>
			</div>
			<div class="status">
				<div class="mui-clearfix">
					<span class="color_1 fl f_16 mb_15">高校团餐-珍轩餐饮1期</span>
					<span class="color_4 fr f_14">筹款中</span>
				</div>
				<span class="color_3 f_14 mui-block">借款金额   <span class="color_1">20万</span></span>
				<span class="color_3 f_14">起投金额   <span class="color_1">100元</span> </span>
			</div>
			<div class="card">
				<div class="color_1 f_16 border-bottom title">项目介绍</div>
				<p class="color_2 f_14 content">
					珠海市**餐饮服务有限公司，成立于2009年，地址：珠海市金湾
					区三灶镇*********，经营范围：珠海市金湾区三灶镇。注册资本
					人民币2040.81万元，该公司的收款账户银行为建设银行，公司法
					人为吴**，现申请流动资金周转。
				</p>
			</div>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-collapse">
					<a class="mui-navigate-right color_1 f_16 border-bottom" href="javascript:;">还款来源</a>
					<div class="mui-collapse-content f_14 ">
						<p class="color_2">第一还款来源：借款人经营珠海市**餐饮服务有限公司销售回款</p>
						<p class="color_2">第一还款来源：借款人经营珠海市**餐饮服务有限公司销售回款</p>
					</div>
				</li>
			</ul>
			<ul class="mui-table-view">
				<li class="mui-table-view-cell mui-collapse">
					<a class="mui-navigate-right color_1 f_16 border-bottom" href="javascript:;">还款人信息</a>
					<div class="mui-collapse-content f_14 ">
						<p class="color_2">企业名称：珠海市**餐饮服务有限公司</p>
						<p class="color_2">营业执照编号：91440**********</p>
						<p class="color_2">法人代表：吴**</p>
						<p class="color_2">法人代表身份证：411303**********</p>
					</div>
				</li>
			</ul>
			<ul class="mui-table-view" style="margin-bottom: 15px;">
				<li class="mui-table-view-cell" id="questions">
					<a class="mui-navigate-right color_1 f_16 border-bottom" href="javascript:;">常见问题</a>
				</li>
			</ul>
		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/app.js"></script>
		<script src="vue/vue.min.js"></script>
		<script type="text/javascript">
			(function($,doc){
				$.init({
					beforeback:function(){
						setTimeout(function(){
							reset()
						},400)
					}
				});
				$.plusReady(function(){
					//禁止出现滚动条
					plus.webview.currentWebview().setStyle({
	                    scrollIndicator: 'none'
	             	});
				});
				var questions=doc.getElementById("questions");
				var investment=doc.getElementById("investment");
				investment.addEventListener("tap",function(){
					app.openViwe('investment.html');
					setTimeout(function(){
						reset()
					},400)
				});
				questions.addEventListener("tap",function(){
					app.openViwe("questions.html")
				})
				if($.os.plus){
					//5+App环境
				}else{
					//浏览器环境
				}
				function reset(){
					scrollTo(0,0,100)
				}
			}(mui,document));
		</script>
	</body>

</html>